<template>
  <div>
    <el-dialog
      title="添加入校资料"
      v-model="inSchooleTextVis"
      width="700"
      @close="diaClose"
    >
      <el-form :model="addSchoolPlanForm">
        <el-form-item label="学校照片" :label-width="100">
          <el-upload
            class="upload-demo"
            :action="`${$config.API_URL}common/upload/`"
            :on-preview="handlePreview"
            :on-remove="handleRemove"
            :before-remove="beforeRemove"
            :on-success="handleAvatarSuccess"
            accept=".png,.jpeg,.jpg"
            multiple
            limit="9"
            :on-exceed="handleChangesImage"
            :file-list="fileList"
          >
            <el-button size="small"    type="success">点击上传</el-button>
          </el-upload>
        </el-form-item>
        <el-form-item label="学校视频" :label-width="100">
          <el-upload
            class="upload-demo"
            :action="`${$config.API_URL}common/upload/`"
            :on-preview="handlePreview"
            :on-remove="handleRemoveVideo"
            :before-remove="beforeRemove"
            :on-success="handleAvatarSuccessVideo"
            :on-error="handleError"
            accept=".mp4,.ogg,.flv,.avi,.wmv,.rmvb,.mov"
            multiple
            :on-exceed="handleChangesImage"
            :file-list="videoList"
          >
            <el-button size="small"    type="success">点击上传</el-button>
          </el-upload>
        </el-form-item>
        <el-form-item label="其他材料信息" :label-width="100">
          <el-input
            v-model="addSchoolPlanForm.description"
            style="width: 440px"
            :rows="2"
            type="textarea"
            placeholder="请输入其他材料信息"
          />
        </el-form-item>
      </el-form>

      <template #footer>
        <div style="display: flex;justify-content: space-between;">
          <el-button @click="handleClose" :loading="loadingSave" style="width: 100%;" type="success" plain>取消</el-button>
        <el-button
        style="width: 100%;"
          type="success"
          @click="submitDataS"
          :loading="loadingSave"
          :disabled="loadingTitle == '详情'"
          >确定</el-button
        >
        </div>
        
      </template>
    </el-dialog>
  </div>
</template>

<script>
import { addschool } from "@/api/api";
export default {
  data() {
    return {
      inSchooleTextVis: false,
      addSchoolPlanForm: {
        id: "",
        images: [],
        videos: [],
        description: "",
      },
      fileList: [],
      videoList: [],
    };
  },
  methods: {
    handleError(e) {
      console.log(e, "----------报错信息");
    },
    handleClose() {
      this.inSchooleVis = false;
      this.inSchooleTextVis = false;
    },
    addPlan(e) {
      if (e.images) {
        this.fileList = e.images.map((item, index) => {
          return {
            name: `${e.city}${e.county}-${e.school_name}${e.grade}${
              e.class_name
            }-${e.course}照片-${index + 1}`,
            url: item,
          };
        });
      }
      if (e.video) {
        this.videoList = e.video.map((item, index) => {
          return {
            name: `${e.city}${e.county}-${e.school_name}${e.grade}${
              e.class_name
            }-${e.course}视频-${index + 1}`,
            url: item,
          };
        });
      }
      this.inSchooleTextVis = true;
      this.addSchoolPlanForm.id = e.id;
    },
    diaClose() {
      this.fileList = [];
      this.videoList = [];
    },
    submitDataS() {
      let vm = this;
      this.addSchoolPlanForm.images = this.fileList.map((item) => {
        return item.url;
      });
      this.addSchoolPlanForm.videos = this.videoList.map((item) => {
        return item.url;
      });
      addschool({ ...this.addSchoolPlanForm }).then((res) => {
        if (res.code == 1) {
          vm.$message.success(res.msg);

          vm.inSchooleTextVis = false;
          vm.$emit("getData");
        }
      });
    },
    handlePreview(file) {
      //console.log(file);
    },
    handleRemove(file, fileList) {
      this.fileList = this.fileList.filter((item) => {
        return item.name != file.name;
      });
      //console.log(this.fileList);
    },
    handleRemoveVideo(file, fileList) {
      this.videoList = this.videoList.filter((item) => {
        return item.name != file.name;
      });
      //console.log(this.videoList);
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    handleAvatarSuccess(res, file) {
      this.fileList.push({
        name: res.data.url,
        url: res.data.url,
      });
    },
    handleAvatarSuccessVideo(res, file) {
      console.log(res, file,'-------成功');
      this.videoList.push({
        name: res.data.url,
        url: res.data.url,
      });
    },
    handleChangesImage(e) {},
  },
};
</script>
 